@import '../../assets/css/reset.css';
@import '../../assets/css/common.css';
@import '../../assets/libs/swiper/swiper-bundle.min.css';
@import '../../assets/css/property.css';
// <!-- 云服务 -->
.service{
    text-align: center;
    h2{
        margin-top: 90px;
        font-size: 40px;
        color: black;
    }
    p{
        margin:10px 0px 20px 0px;
    }
    a{
        color: #1271ef;
    }
    a:hover{
        cursor: pointer;
        color: deepskyblue;
    }
    li{
        width: 240px;
        height:280px ;
        box-shadow:2px 4px 10px 0px rgba(18, 113, 219, .6);
        margin-bottom: 50px;
    }
    ul{
        padding:25px 0px;
    }
    h3{
        font-size: 22px;
        color: black;
    }
}

//  <!-- 轮播图 -->
.banner{
    .swiper{
        height: 680px;
        width: 100%;
    }
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .swiper-btn{
        display: none;
        
    }
    
    .swiper:hover .swiper-btn {
        display: block;
       }
    


}

// <!-- API分类 -->
.api{
    width: 100%;
    height: 564px;
    background: url('../../assets/imgs/more-api-bg.svg') center no-repeat #f8f9fb;
    text-align: center;
    h2{
        font-size: 40px;
        color: black;
        margin-top: 50px;
    }
    p{
        margin:10px 0px 20px 0px;
        font-size: 16px;
        color: #000;
    }
    a{
        color: #1271ef;
    }
    a:hover{
       
        color: deepskyblue;
    }
    li{
        width: 224px;
        height: 138px;
        box-shadow:2px 4px 10px 0px rgba(18, 113, 219, .6); 
        
    }
    img{
        margin-top: 36px;
    }
    ul{
        height: 316px;
        flex-wrap: wrap;
        margin: 30px 0px 10px 0px;
    }
    .a1{
        font-size: 12px;
    }
    
}

// <!-- APIMaster -->
.apimaster{
    text-align: center;
    
    h2{
        font-size: 40px;
        color: black;
        margin-top: 76px;
    }
    p{
        margin:10px 0px 20px 0px;
    }
    a{
        color: #1271ef;
        font-size: 12px;
    }
    a:hover{
       
        color: deepskyblue;
    }
    ul{
        width: 507px;
        height: 596px;
    }
    li{
        width: 500px;
        height: 80px;
        background-color: #FBFBFD; 
        position: relative;

        .smallp{
            display: block;
            width: 4px;
            height: 24px;
            background-color: #1271ef;
            position: absolute;
            top:28px;
            left: 0;
        }
        img{
            position: absolute;
            top:15px;
            left: 20px;
        }
        h3{
            position: absolute;
            top:13px;
            left: 46px;
            color: #000;
        }
        p{
            position: absolute;
            top:30px;
            left:20px;
            font-size: 12px;
        }
        





    }
    
    




}
// <!-- 行业巨头 -->
.industry{
    height: 550px;
    width: 100%;
    padding-top: 94px;
    box-sizing: border-box;
    position: relative;
    
    .box1{
        margin-bottom: 70px;
        position: absolute;
        top: 85px;
        left: 50%;
        transform: translate(-50%);
    }
        h2{
            font-size: 40px;
            color: #000;
            
        }
        a{
            color: #1271ef;
            font-size: 12px;
            line-height: 32px;
        }
        .industry-box{
            width: 100%;
            height: 270px;
            background-color: #f8f9fb;
            position: absolute;
            bottom: 0px;
            left: 50%;
            transform: translate(-50%);
            opacity: 0;
            transition: all 1s linear;
            
           
            
        }
        .industry-box3{
            position: relative;
            height: 270px;
        }
        .img-box{
            width: 580px;
            height: 290px;
            position: absolute;
            bottom: 0px;
        }
    .industry-box2{
        width: 550px;
        height: 290px;
        position: absolute;
        right: 0;
        bottom: 0;
        & p:nth-child(2){
            margin: 20px 0px 50px;
            font-size: 14px;
            line-height: 24px;

        }
        .industry-span1{
            width: 13px;
            height: 4px;
            background-color: blue;
            align-self: center;
            margin-right: 5px;
        }
        .industry-span2{
            font-size: 12px;
        }

    }
   .dpb{
       opacity: 1 !important;
   }
    




}



//  <!-- 数据安全 -->
.safe{
    text-align: center;
    padding-bottom: 63px;
    h2{
        font-size: 40px;
        color: black;
        margin-top: 96px;
    }
    p{
        margin:10px 0px 20px 0px;
    }
    a{
        color: #1271ef;
        font-size: 12px;
    }
    a:hover{
       
        color: deepskyblue;
    }
   
    li{
        width: 200px;
        height: 142px;
        p{
            width: 200px;
            height: 52px;
            line-height: 52px;
        }

      
    }
}
// <!-- 免费体验 -->
.taste{
    width: 100%;
    height: 240px;
    text-align: center;
    background: url('../../assets/imgs/login-register-bg.svg')no-repeat #1271ef;
    h2{
        font-size: 32px;
        color:#fff;
        margin: 64px 0px 32px 0px;
    }
    a{
        width: 128px;
        height: 40px;
        border: 1px solid #fff;
        line-height: 40px;
        color: #fff;
    }


}
// 回到顶部
.top{
    width: 40px;
    height: 40px;
    background: url('../../assets/imgs/returntopicon.jpg');
    position: fixed;
    bottom: 0px;
    right: 10px;
    left: 50%;
    margin-left: 610px;
    background-position: -56px -213px;
    border-radius: 50%;
    display: none;

    
    &:hover{
        cursor: pointer;
    }
}